<template>
  <div class="container">
    <FormList
      ref="formRef"
      :formList="listData.editAddList"
      :num="24"
      :gutter="24"
      layout="horizontal"
      :btnSpan="18"
      :showResetBtn="false"
      btnTitle="保存"
      :labelCol="4"
      :wrapperCol="18"
      :btnWarpSpan="14"
      :btnWarpOffset="4"
      @Search="editForm"
    />
  </div>
</template>
  
<script setup>
import { ref } from "vue";
import { getList, edit } from "@/api/system";
import { reactive } from "vue";
import { message } from "ant-design-vue";
const props = defineProps({
  type: String,
});
const formRef = ref();
const state = reactive({
  formData: {},
});
const listData = reactive({
  editAddList:[]
  // editAddList: [
  //   {
  //     type: "inputNumber", //类型
  //     label: "提现手续费(%)", //标签
  //     name: "cash_rate", //字段
  //     rules: [{ required: true, message: "请输入" }], //规则
  //     formProps: {}, //form的props
  //     itemProps: {}, //item的props
  //   },
  //   {
  //     type: "inputNumber", //类型
  //     label: "单次最低提现金额", //标签
  //     name: "cash_min", //字段
  //     rules: [{ required: true, message: "请输入" }], //规则
  //     formProps: {}, //form的props
  //     itemProps: {}, //item的props
  //   },
  //   {
  //     type: "inputNumber", //类型
  //     label: "单次最高提现金额", //标签
  //     name: "cash_max", //字段
  //     rules: [{ required: true, message: "请输入" }], //规则
  //     formProps: {}, //form的props
  //     itemProps: {}, //item的props
  //   },
  //   {
  //     type: "editor", //类型
  //     label: "提现提示", //标签
  //     name: "cash_tip", //字段
  //     rules: [{ required: true, message: "请选择" }], //规则
  //     formProps: {}, //form的props
  //     itemProps: {}, //item的props
  //   },
  // ]
})


// 获取列表
const getData = () => {
  getList({
    s_group: props.type,
  }).then((res) => {
    if (res.code == 0) {
      const data = res.data;
      state.formData = data;
      let obj = {};
      data.map((item) => {
        obj[item.s_key] = item.s_value;
      });
      formRef.value.resetForm({
        ...obj,
      });
      let list = state.formData
      list = list.map(item => ({
        type: item.type, //类型
        label: item.s_name, //标签
        name: item.s_key, //字段
        rules: [{required: true, message: "请输入"}], //规则
        formProps:{},
        itemProps:{},
      }))
      listData.editAddList=list
    }
  });
};

// 保存
const editForm = (values) => {
  let params = state.formData.map((item) => {
    for (let key in values) {
      if (key === item.s_key) {
        return {
          s_key: key,
          s_value: values[key],
        };
      }
    }
  });
  edit({
    edit_data: params,
  }).then((res) => {
    if (res.code == 0) {
      message.success(res.msg);
      getData();
    }
  });
};

getData();
</script>
  
<style scoped lang="scss">
.container {
  display: flex;
  justify-content: center;
  height: 100%;
  overflow: auto;

  &::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
}
</style>
  